<!DOCTYPE html>
<html class="index">
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="author" content="Daniel Bohry" />
<meta name="viewport"
	content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=yes" />
<script
	src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCRGO9TiVkbIRsmXsIsM1QDjzLslGpcr-g&sensor=false"></script>

<title>Google Maps API</title>

<link type="text/css" rel="stylesheet"
	href="./css/jquery.mobile-1.4.0.min.css" />
<link type="text/css" rel="stylesheet" href="./css/demo.css" />
<link type="text/css" rel="stylesheet" href="./css/default.css" />
<link type="text/css" rel="stylesheet" href="./css/jquery.mmenu.all.css" />

<script type="text/javascript" src="./js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="./js/jquery.mmenu.min.all.js"></script>
<script type="text/javascript" src="./js/default.js"></script>
<script type="text/javascript" src="./js/jquery.mobile-1.4.0.js"></script>

<script type="text/javascript" src="./js/loadMap.js"></script>
<script type="text/javascript" src="./controllers/index.controller.js"></script>

</head>
<body>
	<div data-role="page">
		<div class="header">
			<a href="#menu" data-ajax="false"></a>Google Maps API
		</div>
		<div id="content" data-role="content">
			<div id="map_canvas" class="map-container"></div>
		</div>
	</div>

	<div id="page2" data-role="page">
		<div class="header">
			<a href="#menu" data-ajax="false"></a>Profile
		</div>
		<div class="content" data-role="content">
			<div>
				<label for="profileName">Name</label> <input type="text"
					id="profileName" name="profileName" /> <label for="profileEmail">E-mail</label>
				<input type="text" id="profileEmail" name="profileEmail" />
				<button id="profileSave">Save</button>
			</div>
		</div>
	</div>

	<div id="page3" data-role="page">
		<div class="header">
			<a href="#menu" data-ajax="false"></a>My Locations
		</div>
		<div class="content" data-role="content">
			<p>
				This is the <strong>My Locations</strong> page.
			</p>
			<p>Here you can set your personal locals on the map.</p>
		</div>
	</div>

	<div id="page4" data-role="page">
		<div class="header">
			<a href="#menu" data-ajax="false"></a>Map Sync
		</div>
		<div class="content" data-role="content">
			<p>
				This is the <strong>Map Sync</strong> page.
			</p>
			<p>Here you can syncronize your maps with server.</p>
		</div>
	</div>

	<nav id="menu">
		<ul>
			<li class="Selected"><a href="index.html">Home</a></li>
			<li><a href="index.html#page2">Profile</a></li>
			<li><a href="index.html#page3">My Locations</a></li>
			<li><a href="index.html#page4">Map Sync</a></li>
			<li class="Label">External</li>
			<li><a href="../index.html" rel="external">Back to the
					documentation</a></li>
		</ul>
	</nav>
</body>
</html>